<template>
  <div class="collect">
    <div class="collect_nav">
        <i @click="back()"></i>
        <span>宝贝收藏</span>
        <span>店铺收藏</span>
        <b></b>
    </div>
    <div class="collect_list">
        <img src="../../assets/images/no_collect.png">
        <p>收藏夹肚子空空</p>
        <router-link to="/home">
            <span>去逛逛</span>
        </router-link>
    </div>
  </div>
</template>

<script>

  export default{
    methods:{
        back () {
            history.back();
        }
    }
  }

</script>

<style>
.collect{
    width: 100%;
    height: 47.33rem;
    position: absolute;
    z-index: 12;
    background-color: #F8F8F8;
}
.collect_nav{
    border-bottom: solid 1px #f3f3f3;
    background: #FFF;
    font-size: 14px;
    line-height: 30px;
    text-align: center;
    width: 100%;
    padding: 5px 0;
    position: relative;
}
.collect_nav i{
    position: absolute;
    top: 5px;
    left: 10px;
    width: 30px;
    height: 30px;
    background: url(../../assets/images/icon_back.png) no-repeat center center;
    background-size: 10px 20px;
}
.collect_nav span{
    padding: 0 15px;
    color:#000;
}
.collect_nav span:first-of-type{
    color: #fe3355;
}
.collect_nav b{
    position: absolute;
    top: 14px;
    left: 50%;
    height: 12px;
    width: 1px;
    background: #e6e5e5;
}
.collect_list{
    width: 100%;
    margin-top:178px;
    text-align: center;
}
.collect_list img{
    width: 80px;
    margin-bottom: 15px;
}
.collect_list p{
    font-size: 16px;
}
.collect_list a{
    padding: 6px 30px;
    border-radius: 5px;
    border: solid 1px #ddd;
    background: #FFF;
    margin-top: 20px;
    line-height: 18px;
    display: inline-block;
}
.collect_list a span{
    color: #333;
    font-size: 16px;
}
</style>
